<script setup lang="ts">
import {computed, ref} from "vue";

const jjj = computed(()=>{
  console.log(value1)
  return new Date().getDay() != new Date(value1.value).getDay()
})

const value1 = ref(new Date())
const disabled = (v) => {

  console.log(v)
  return v.getTime() < new Date().getTime() - 8.64e7
}
/* 限制天 */
const disableDate = (time) => {
  return Date.now() > time.getTime() ;
}

/* 限制小时 */
const disabledHour = () => {
  const arrs = []
  for (let i = 0; i < 24; i++) {
    if (new Date().getHours() <= i) continue;
    arrs.push(i)
  }
  return arrs;
}

/* 限制分 */
const disabledMinute = () => {
  const arrs = []
  for (let i = 0; i < 60; i++) {
    if (new Date().getMinutes() <= i) continue;
    arrs.push(i)
  }
  return arrs;
}

/* 限制秒 */
const disabledSecond = () => {
  const arrs = []
  for (let i = 0; i < 60; i++) {
    if (new Date().getSeconds() <= i) continue;
    arrs.push(i)
  }
  return arrs;
}

</script>

<template>
  <div>
    <el-date-picker
        v-model="value1"
        type="datetime"
        format="YYYY-MM-DD HH:mm"
        value-format="YYYY-MM-DD HH:mm:00"
        :disabled-date=" disableDate"
        :disabled-hours="jjj && disabledHour "
        :disabled-minutes="jjj && disabledMinute"
        placeholder="Select date and time"
    >
    </el-date-picker>
    <el-button type="warning">Warning</el-button>
    <span>{{value1}}</span>
  </div>
</template>